<template>
  <div class="pieChart">
    <!-- {{data}} -->
    <echarts v-if="data && data.length > 0" type='pie' v-model="data" :dimensions='title' xName='' yName=''
      :series="series"></echarts>
    <!-- <myECharts v-model="dataS" :key='keyS' xName='供应商' yName='备件费/元' :dimensions='dimensionsS'></myECharts> -->
  </div>
</template>
<script>
import echarts from '_components/echarts/echarts.vue'

export default {
  name: 'index',
  components: {
    echarts
  },
  data() {
    return {
      dimensions: ['name', 'num'],
      series: {
        xAxis: {
          show: false
        },
        yAxis: {
          show: false
        },
        type: 'pie',
        //   barWidth: null,
        radius: ['25%', '40%'],
        labelLine: {
          length: 50,
          lineStyle: {
            color: "#fff"
          },

        },

        label: {
          overflow: "break",
          formatter: '{b|{b}}\n {per|{d}%}\n',
          rich: {

            b: {
              color: '#FFFFFF',
              fontSize: 16,
              fontWeight: 500,
            },
            per: {
              color: '#1BFAF2',
              // backgroundColor: '#4C5058',
              padding: [11, 0, 11, 4],
              fontSize: 16,
              fontWeight: 400,
            }
          }
        },
      }
    }
  },
  props: {
    data: Array,
    title: Array
  },

  created() {
  },
  mounted() {
  },
  methods: {
  }
}
</script>
<style scoped>
.pieChart {

  width: 100%;
  height: 100%;
}

.head img {
  width: 100%;
  height: 100%;
}
</style>


<style>

</style>
